<template>
	<view>
		<view class = "body-card uni-flex uni-row body-row" v-for="(item,index) in doctorList" :key="index">	
			<view class="body-left">
				<image style="width: 100%;height: 100%;" :src="item.photo"></image>
				<span style="font-size: 13px;">{{item.name}}</span></br>
				<span style="font-size: 13px;">({{item.id}})</span>
			</view>
			<view class="body-center">
				<span style="font-size: 13px;">科室 ：{{item.keshi}}</span></br>
				<span style="font-size: 13px;">性别 ：{{item.sex}}</span></br>
				<span style="font-size: 13px;">年龄 ：{{item.age}}</span></br>
				<span style="font-size: 13px;">电话 ：{{item.phone}}</span></br>
				<span style="font-size: 13px;word-break:break-all;">擅长 ：{{item.shanchang}}</span></br>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		created() {
			this.doctorList = JSON.parse(uni.getStorageSync("doctorList"));
			console.log(this.doctorList);
		},
		data() {
			return {
				doctorList:[]
			}
		},
		
		methods: {
			
		}
	}
</script>

<style>
	
	.uni-flex {
		display: flex;
		flex-direction: row;
	}
	
	.uni-row {
		flex-direction: row;
	}
	
	.uni-column {
		flex-direction: column;
	}
	
.header {
		height: 60px;
		width: auto;
		background-color: #7ec0ee;
		color: #FFFFFF;
	
	}
.body-card{
	height: 170px;
	width: 90%;
	margin: 0 auto;
	margin-top: 15px;
	background-color: #FFFFFF;	
	border-radius:5px;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);
	-moz-box-shadow: 2px 2px 10px #909090;
	-webkit-box-shadow: 2px 2px 10px #909090;
	box-shadow:2px 2px 10px #909090;
}
.body-left{
	height: 80px;
	width: 25%;
	
	margin-top: 10px;
	margin-left: 10px;
}

.body-center{
	height: 130px;
	width: 75%;
	
	margin-top: 10px;
	margin-left: 10px;
}
</style>
